<div class="po-table-footer-show-subtitle" (click)="modal.open()">
  <div class="po-table-footer-show-subtitle-container">
    <span class="po-table-show-subtitle">{{ literals.seeCompleteSubtitle }}</span>
  </div>
</div>

<po-modal #modal p-size="sm" [p-title]="literals.completeSubtitle" [p-components-size]="componentsSize">
  @for (subtitle of subtitles; track subtitle) {
    <div class="po-table-subtitle-footer-modal po-row">
      <po-table-subtitle-circle p-hide-title="true" [p-subtitle]="subtitle"> </po-table-subtitle-circle>
      <span class="po-table-subtitle-text">{{ subtitle.label }}</span>
    </div>
  }
</po-modal>
